<!doctype html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>[[${articleView.article.title}]]_Gradual个人博客 - 一个在web后端为兴趣和生活努力的Java程序员个人博客网站</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="css/base.css" rel="stylesheet" th:href="@{/css/base.css}">
    <link href="css/index.css" rel="stylesheet" th:href="@{/css/index.css}">
    <link href="css/info.css" rel="stylesheet" th:href="@{/css/info.css}">
    <link href="css/m.css" rel="stylesheet" th:href="@{/css/m.css}">
    <link rel="stylesheet" th:href="@{/css/wangEditor.css}">
    <style>
        table {
            border: 1px solid black;
            background-color: black;
            margin: 20px 0;
        }

        table tr {
            border: 1px solid black;
            background-color: white;
        }

        .news_con ul, ol {
            margin-left: 30px;
        }

        .news_con img {
            margin: 10px 0;
        }
    </style>
</head>
<body>
<div th:replace="tmp/temp::#header"></div>
<article>
    <div th:replace="tmp/temp::#l_box(incloudUri='info')"></div>
    <main th:object="${articleView}">
        <div class="infosbox">
            <div class="newsview">
                <h3 class="news_title" th:text="*{article.title}">个人博客，属于我的小世界！</h3>
                <div class="bloginfo">
                    <ul class="ul-none">
                        <li class="author">作者：<a href="/">Gradual</a></li>
                        <li class="timer" th:text="'时间: ' + *{article.createTime}"></li>
                    </ul>
                </div>
                <!--博文标签-->
                <div class="tags">
                    <a th:each="type : *{article.types}" th:text="${type.type}" th:href="@{/article/type/} + ${type.id}" target="_blank"></a>
                    <div class="manager" style="float: right;" th:if="${session.user != null and session.user.role == 1} ">
                        <a href="#" th:href="@{/edit-} + *{article.id} + '.html'">编辑</a>
                        <a href="#" id="deleteArticle">删除</a>
                    </div>
                </div>


                <!--博文空间-->
                <div class="news_con" th:utext="*{article.html}">

                </div>
            </div>
            <!--博文点赞-->
            <div class="share" id="praise">
                <p class="diggit">
                    <a href="javascript:void(0)">很赞哦！ </a>(<b id="diggnum" th:text="*{article.praise}"></b>)
                </p>
            </div>
            <!--博文留言-->
            <div class="news_pl">
                <h2>文章评论</h2>
                <div class="gbko">
                    <div class="fb" th:each="discuss : *{discusses}">
                        <ul class="ul-none">
                            <p class="fbtime"><span th:text="${discuss.createTime}"></span>[[${discuss.nikename}]]</p>
                            <p class="fbinfo" th:text="${discuss.text}"></p>
                        </ul>
                    </div>

                    <script>
                        function CheckPl(obj) {
                            if (obj.saytext.value != "" && window.confirm("确定提交该留言？")) {
                                $.ajax({
                                    url: "/discuss",
                                    type: "post",
                                    data: $("#saypl").serialize(),
                                    dataType: "JSON",
                                    success: function (data) {
                                        alert(data.message);
                                        if (data.flag === true) {
                                            window.location.reload();
                                        }
                                    }
                                })
                            }
                        }
                    </script>
                    <form name="saypl" id="saypl">
                        <div id="plpost">
                            <p class="saying"><span><a href="javascript:void(0)">共有[[*{discusses.size()}]]条评论</a></span>来说两句吧...
                            </p>
                            <p class="yname"><span>昵称:</span>
                                <input name="nikename" type="text" class="inputText" id="username" value="" size="16">
                            </p>
                            <textarea name="text" rows="6" id="saytext"></textarea>
                            <input type="hidden" id="articleId" name="articleId" th:value="*{article.id}">
                            <input name="submitDiscuss" onclick="CheckPl(document.saypl)" type="button" value="提交">
                        </div>
                    </form>
                </div>
            </div>
        </div>
    </main>
</article>
<div th:replace="tmp/temp::#footer"></div>
<a href="#" class="cd-top">Top</a>

<script src="js/jquery.min.js" type="text/javascript" th:href="@{/js/jquery.min.js}"></script>
<script type="text/javascript" src="js/comm.js" th:href="@{/js/comm.js}"></script>

<script type="text/javascript">
    $(document).ready(function () {
        $("table").attr("cellspacing", "1px");

        var count = 0;
        $(".news_con table tr").each(function () {
            if (0 === count % 2) {
                $(this).css({"background": "#eeeeee"});
            }
            count ++;
        });

        $("#praise").click(function () {
            $.ajax({
                url: "/praise",
                type: "POST",
                dataType: "JSON",
                data: {articleId: $("#articleId").val()},
                success: function (data) {
                    console.log(data.message);
                    if (data.flag === true) {
                        $("#diggnum").html(data.praise);
                    }
                }
            });
        });

        $("#deleteArticle").click(function () {
            var url = "/article/" + $("#articleId").val();
            if (window.confirm("您确认删除该博文吗？")) {
                $.ajax({
                    url: url,
                    dataType: "JSON",
                    type: "DELETE",
                    success: function (data) {
                        alert(data.message);
                        if (data.flag === true) {
                            window.location.href = data.url;
                        }
                    }
                })
            }
        })
    })
</script>
<!--[if lt IE 9]>
<script src="js/modernizr.js" th:src="@{/js/modernizr.js}"></script>
<![endif]-->
</body>
</html>
